angular.module('Controller')
.directive('nrDemoCenterBanner',[()->
            return {
            restrict:'E'
            scope : {
                banners : '=banners'
            }
            replace:true
            templateUrl:'templates/demo-center-banner/demo-center-banner.html'
            controller:'DemoCenterBannerCtrl'
            }
        ])

.controller 'DemoCenterBannerCtrl',($scope,$localStorage)->
    console.log "DemoCenterBannerCtrl"
    mySwiper=undefined
    loadMySwiper=()->
        slidesPerView = 3
        slidesPerGroup = 3
        if document.body.clientWidth <768
            slidesPerView = 1
            slidesPerGroup = 1
        mySwiper = new Swiper('.swiper-container',
            loop: true
            speed: 1000
            slidesPerView: slidesPerView
            slidesPerGroup: slidesPerGroup
            loopedSlides: 20
            loopAdditionalSlides: 20
            onSlideChangeEnd: (swiper) ->
                if swiper.activeIndex == 40
                    swiper.swipeTo 0, 0
                return
        )
        $('.arrow-left').on 'click', (e) ->
            e.preventDefault()
            mySwiper.slidePrev()
            return
        $('.arrow-right').on 'click', (e) ->
            e.preventDefault()
            mySwiper.slideNext()
            return
        window.onresize = ->
        #	alert(document.body.clientWidth );
            if document.body.clientWidth < 768
                mySwiper.params.slidesPerView = mySwiper.params.slidesPerGroup = 1
                mySwiper.onResize()
                mySwiper.slideTo 0, 0
            else
                mySwiper.params.slidesPerView = mySwiper.params.slidesPerGroup = 3
                mySwiper.onResize()
                mySwiper.slideTo 0, 0
            return

    _.defer(()->
        loadMySwiper()
    )
